window.onload = function () {

    var messages = document.getElementsByClassName("messages")[0];
    var sendMessage = document.getElementsByClassName("send")[0];
    var message = document.getElementsByClassName("message")[0];
    var nickName = document.getElementsByClassName("nickName")[0].value;

    var webSocket = null;
    //判断当前浏览器是否支持WebSocket
    if ("WebSocket" in window) {
        webSocket = new WebSocket(wsIp + "/barrage");
    } else {
        alert("当前浏览器 Not support webSocket");
    }

    //连接发生错误的回调方法
    webSocket.onerror = function () {
        setMessageInnerHTML("WebSocket连接发生错误");
    };

    //连接成功建立的回调方法
    webSocket.onopen = function () {
        setMessageInnerHTML("WebSocket连接成功");
    };

    //接收到消息的回调方法
    webSocket.onmessage = function (event) {
        setMessageInnerHTML(event.data);
        messages.scrollTop = messages.scrollHeight;
    };

    //连接关闭的回调方法
    webSocket.onclose = function () {
        setMessageInnerHTML("WebSocket连接关闭");
    };

    //监听窗口关闭事件，当窗口关闭时，主动去关闭websocket连接，防止连接还没断开就关闭窗口，server端会抛异常。
    window.onbeforeunload = function () {
        closeWebSocket();
    };

    //将消息显示在网页上
    function setMessageInnerHTML(innerHTML) {
        messages.innerHTML += innerHTML + "<br />";
    }

    //关闭WebSocket连接
    function closeWebSocket() {
        webSocket.close();
    }

    //发送消息
    sendMessage.onclick = function () {
        var mes = message.value;
        if (mes.trim() == "") {
            alert("您输入的是空字符串");
            message.value = "";
            return;
        }
        message.value = "";
        webSocket.send(mes);
    };

    //回车发送消息
    message.onkeydown = function (event) {
        if (event.keyCode == 13) {
            var mes = message.value;
            if (mes.trim() == "") {
                alert("您输入的是空字符串");
                message.value = "";
                return;
            }
            message.value = "";
            webSocket.send(nickName + "：" + mes);
        }
    };

    //礼物信息展示
    var giftsInfo = document.getElementsByClassName("giftInfo");
    var giftsImg = document.getElementsByClassName("giftImg");
    //显示 、隐藏礼物详细信息
    for (var i = 0, len = giftsImg.length; i < len; i++) {
        giftsImg[i].onmouseover = function () {
            cancle();
            for (var j = 0; j < len; j++) {
                if (giftsImg[j] == this) {
                    giftsInfo[j].style.display = "block";
                }
            }
        };
        giftsImg[i].onmouseout = function () {
            cancle();
        }
    }
    //隐藏所有礼物详细信息
    function cancle() {
        for (var i = 0, len = giftsImg.length; i < len; i++) {
            giftsInfo[i].style.display = "none";
        }
    }


    /**
     * 方法概述：  刷礼物
     */
    var prices = document.getElementsByClassName("price");
    var imgUrl = document.getElementsByClassName("imgUrl");
    for (var j = 0, lens = giftsImg.length; j < lens; j++){

        giftsImg[j].onclick = function () {

            for (var q = 0; q < lens; q++) {
                if (giftsImg[q] === this) {
                    var anchorUserId = document.getElementById("anchorUserId");
                    var anchorBalance = document.getElementById("anchorBalance");
                    var price = prices[q].innerHTML;
                    var gif = imgUrl[q].src;
                    var userId = anchorUserId.value;
                    var balance = anchorBalance.value;
                    var url = "/userRegisterAndLogin?methodName=upDatePrice&price="+price+"&userId="+userId+"&balance="+balance;
                    var ajax = new XMLHttpRequest();
                    ajax.open("post",url);
                    ajax.send(null);
                    ajax.onreadystatechange=function () {
                        if (ajax.readyState===4){
                            if (ajax.status === 200 || ajax.status === 304) {
                                if(ajax.response.length>5){
                                    alert(ajax.response);
                                    return;
                                }
                                // var img = document.getElementById("gif_url");
                                // var gifs = document.getElementById("gif");
                                // img.src=gif;
                                // gifs.style.display="block";
                            }
                        }
                    }
                }
            }
        };
    }

};












